<template>
	<el-icon class="my-icon" v-bind="$attrs" v-if="ElIcons || svgIcons">
		<component :is="icon" v-if="ElIcons" />
		<svg v-if="svgIcons"><use :xlink:href="`#icon-${icon}`" /></svg>
	</el-icon>
</template>

<script setup name="MyIcon">
/**
 * 图标组件
 * @module components/my-icon
 */

/**
 * 属性参数
 * @member props
 * @property {string} [icon] 图标名称，className 支持 Element 和 IconFont。
 */
const props = defineProps({
	icon: String
});

const ElIcons = computed(() => !!$store.user.ElIcons.find((item) => item === props.icon)),
	svgIcons = computed(() => !!$store.user.svgIcons.find((item) => item === props.icon));
</script>
